/**
 * 数据协议约定
 */
export type BaseMaterialType = {
    id?: string
    type: string
    cname: string
    parentId?: string
    icon?: string
    isInstance?: boolean
    style?: any
    class?: any
}
/* ---------------B START--------------*/
type btnComponentType = 'primary' | 'ghost' | 'dashed' | 'link' | 'text' | 'default';
export type ButtonMaterialType = BaseMaterialType & {
    type: 'button'
    cname: '按钮'
    props?: {
        text?: string,
        btnType?: btnComponentType,
        icon?: string,
    }
    actions?: {
        onClick?: () => void
    }
}
export type BaseContainerMaterialType = BaseMaterialType & {
    type: 'baseContainer'
    cname: '基本容器'
    props?: {
        orientation?: string
    }
}
export type InputMaterialType = BaseMaterialType & {
    type: 'input'
    cname: '单行输入框'
    props?: {
        cname?: string,
        content?: string,
        icon?: string,
    }
    actions?: {
        onClick?: () => void
    }
}
export type TextareaMaterialType = BaseMaterialType & {
    type: 'textarea'
    cname: '多行输入框'
    props?: {
        content?: string,
        icon?: string,
        rows?: number,
    }
    actions?: {
        onClick?: () => void
    }
}
export type CheckboxMaterialType = BaseMaterialType & {
    type: 'checkbox'
    cname: '复选框'
    props?: {
        content?: string,
        icon?: string,
    }
    actions?: {
        onClick?: () => void
    }
}
/* ---------------B END--------------*/
/* ---------------C START--------------*/
export type ChartMaterialType = BaseMaterialType & {
    type: 'chart'
    cname: '图表'
    props?: {
        src?: string
        alt?: string
    }
    actions?: {
        onClick?: () => void
        onLoad?: () => void
    }
}
/* ---------------C END--------------*/
/* ---------------D START--------------*/
export type FlexContainerMaterialType = BaseMaterialType & {
    type: 'flexContainer'
    cname: 'flex容器'
    props?: {
    }
}
export type TwoColumnsContainerMaterialType = BaseMaterialType & {
    type: 'twoColumnsContainer'
    cname: 'flex容器'
    props?: {
    }
}
/* ---------------D END--------------*/
/* ---------------E START--------------*/
/* ---------------E END--------------*/
/* ---------------F START--------------*/
/* ---------------F END--------------*/
/* ---------------G START--------------*/
type GridMaterialRowType = {
    editColumnIndex: number //处于编辑状态的列
}
type GridMaterialColType = {
    span:number
}
type GridMaterialChildrenType = {
    span:number
}
export type GridMaterialType = BaseMaterialType & {
    type: 'grid'
    cname: '文本'
    props?: {
        row: {
            editColumnIndex: number
        }
    },
    children:GridMaterialChildrenType[]
    actions?: {
        onCopy?: () => void
        onEdit?: () => void
    }
}
/* ---------------G END--------------*/
/* ---------------H START--------------*/
/* ---------------H END--------------*/
/* ---------------I START--------------*/
export type ImageMaterialType = BaseMaterialType & {
    type: 'image'
    cname: '图片'
    props?: {
        src?: string
        alt?: string
    }
    actions?: {
        onClick?: () => void
        onLoad?: () => void
    }
}
export type IconMaterialType = BaseMaterialType & {
    type: 'icon'
    cname: '图标'
    props?: {
        component?: any
    }
}
/* ---------------I END--------------*/
/* ---------------T START--------------*/
export type TextMaterialType = BaseMaterialType & {
    type: 'text'
    cname: '文本'
    props?: {
        content?: string
    }
    actions?: {
        onCopy?: () => void
        onEdit?: () => void
    }
}
export type TableMaterialType = BaseMaterialType & {
    type: 'table'
    cname: '表格'
    props?: {
        dataSource?: any
        columns?: any
    }
    actions?: {
        onCopy?: () => void
        onEdit?: () => void
    }
}
/* ---------------T END--------------*/


export type MaterialType = BaseContainerMaterialType | TableMaterialType | TwoColumnsContainerMaterialType | GridMaterialType | FlexContainerMaterialType | InputMaterialType | TextareaMaterialType| CheckboxMaterialType | ButtonMaterialType | TextMaterialType | IconMaterialType | ImageMaterialType | ChartMaterialType;
export const MaterialTypeStr = {
    GridMaterialType: 'grid'
};
// 类型保护和推导、断言
const isImage = (material: MaterialType): material is ImageMaterialType => {
    return material.type === 'image';
}

/*
const b: MaterialType = {
    type: 'text'
};
if(isImage(b)){
    b.type = 'image';
}
*/
